<!--
* description: 技术援助单--附件信息详情
* author
* createdDate: 2021-7-30
-->
<template>
  <section class="editStoreReturnRegistration-detail">
    <el-dialog
      v-dialogDrag
      :visible.sync="curPopupsVisible"
      :title="textMap"
      :append-to-body="true"
      width="70%"
      :close-on-click-modal="false"
      @open="open"
      @close="closeEdit"
    >
      <dialogHeader
        slot="title"
        :title="textMap"
        :style-type="$store.state.app.dialogType"
      />
      <div class="filter-container filter-title">附件信息</div>
      <div class="app-container app-container-table">
        <one-table-template
          ref="multipleTable"
          :key="oneTableKey"
          :dynamic-components="tableComponents"
          :dynamic-buttons="tableButtons"
          :dynamic-api-config="apiConfig"
          :dynamic-table-cols="tableCols"
          :dynamic-form-fields="formField"
          :dynamic-is-show-more-btn="true"
          :dynamic-is-show-select="false"
          :dynamic-is-init-table="true"
          :refresh-table-key="refreshTableKey"
          :dynamic-table-defult-height="300"

        />
      </div>
    </el-dialog>
  </section>
</template>
<script>
import { oneTableWithViewTemplateMixins } from '@/components/mixins/oneTableWithViewTemplateMixins'
import { formMixins } from '@/components/mixins/formMixins'
import { exportExcel } from '@/utils/getTimeString.js'
import OneTableTemplate from '@/components/templates/oneTable'
import api from '@/api/se/apiClaimService'


export default {
  components: {
    OneTableTemplate,
    dialogHeader: () => import("@/components/dialogHeader"),
  },

  // 组件混入对象
  mixins: [oneTableWithViewTemplateMixins, formMixins],

  props: {
    popupsVisible: { type: Boolean, default: false },
    // 传入的vin码
    dynamicEditRowDatas: {
      type: String,
      default: ""
    },
  },

  data() {
    const viewPageCode = 'storeReturnRegistration-edit';
    // 绑定事件配置化事件
    this.$ConfigCache.CacheConfig.bindEvent(this, [viewPageCode]);

    return {
      // apiConfig: api.CoreInfor,
      refreshTableKey: "0",
      flieMsg:{},
      tableButtons: [
        {
          compKey: "btnKey3",
          type: "primary",
          size: "small",
          name: "search",
          clickEvent: () => this.query(),
          text: this.$t("sys.button.query"), // 查询
          position: "right",
          fuzzySearch: true,
        },
        {
          compKey: "btnKey4",
          type: "",
          size: "small",
          name: "reset",
          clickEvent: () => this.reset1(),
          text: this.$t("sys.button.reset"),
          position: "right", // 重置
        },
      ],
      // 动态组件-查询条件
      tableComponents:
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode] &&
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode].formComponents
          .length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[viewPageCode].formComponents
          : [
              {
                compKey: "Key1",
                labelName: "附件类型：",
                codeField: "fileType",
                textField: "fileType",
                component: () => import("@/components/org/LookupValue"),
                oFields: "statusId,statusText",
                type: "dropdownList",
                options: [
                  { statusId: "1", statusText: "整车报告" },
                  { statusId: "2", statusText: "诊断日志" },
                  { statusId: "3", statusText: "实时数据流" },
                ],
                isMust: true,

                disabled: false
              },
            ],
      tableCols:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          .length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          : [
              // {
              //   prop: "releaseId",
              //   label: "主键ID",
              //   hidden: true,
              //   alwaysHidden: true,
              // },
              // {
              //   prop: "createdDate",
              //   label: "返件登记日期",
              //   hidden: true,
              //   alwaysHidden: true,
              // },
              {
                prop: "fileType",
                label: "附件类型",
                align: "center",
              },
              {
          prop: 'controlBtn',
          label: '操作',
          codeField: 'controlBtn',
          width: 100,
          align: 'center',
          fixed: true,
          isComponent: true,
          comps: [
            {
              compKey: 'propKey1',
              align: 'center',
              labelName: '选择',
              component: () => import('@/components/org/linkButton'),
              clickEvent: (index) => this.choose1(index)
            }
          ]
        },
              {
                prop: "ecuName",
                label: "ECU名称",
                align: "center",
              },
              {
                prop: "uploadDate",
                label: "创建时间",
                align: "center",
              },
              {
                prop: "fullName",
                label: "附件名称",
                align: "center",
              },
            ],

      // 标题
      textMap: "附件信息详情",

      // 表单数据
      formField:
        {
          fileType: "",
          ecuName: "",
          uploadDate: "",
          fullName: "",
        },


      }
  },

  watch: {
    // curPopupsVisible: {
    //   handler: function (val) {
    //     if (val) {
    //       this.formField.returnCode = this.dynamicEditRowDatas.returnCode;
    //       this.queryTable(1);
    //     }
    //   },
    // },
  },
  created(){

  },
  mounted() {

  },
  methods: {
    choose1(index){
      this.flieMsg=this.$refs['multipleTable'].list[index]
      this.$emit('func',this.flieMsg)

    },
    // 查询
    query(){
      this.$refs['multipleTable'].list=[]
      const queryObj1 = {
        // 保存mutation
        type: 'mutation',
        // api配置
        apiConfig: {
          ServiceCode: 'queryAttachment',
          APIUrl: '/mp/e3sh/aftersale/TechnicalAssistanceSheetService/queryAttachment.do'
        },
        // 条件/实体参数（变量），根据typeParam中的定义配置
        variables: {
          vin: this.dynamicEditRowDatas,
          fileType: this.formField.fileType,
        }
      }
      // 转换了中台请求格式数据
      var paramD1 = this.$getParams(queryObj1)
       this.$requestAPI(paramD1).then(res => {
        if(res.result === "1"){
            for(let i=0;i<res.rows.length;i++){
            this.$refs['multipleTable'].list.push(res.rows[i])
          }
        }
   })
    },
    open() {
       const queryObj = {
        // 保存mutation
        type: 'mutation',
        // api配置
        apiConfig: {
          ServiceCode: 'queryAttachment',
          APIUrl: '/mp/e3sh/aftersale/TechnicalAssistanceSheetService/queryAttachment.do'
        },
        // 条件/实体参数（变量），根据typeParam中的定义配置
        variables: {
          vin: this.dynamicEditRowDatas,
          fileType: "",
        }
      }
      // 转换了中台请求格式数据
      var paramD = this.$getParams(queryObj)
      // 调用中台API方法（可复用）
      this.$requestAPI(paramD).then(res => {
        // console.log("eeeeeeeeeee",res)
        if(res.result === "1"){
          for(let i=0;i<res.rows.length;i++){
            this.$refs['multipleTable'].list.push(res.rows[i])
          }
          // res.rows.forEach((item)=>{
          //   this.formField.uploadDate=item.uploadDate
          //   this.formField.fileType=item.fileType
          //   this.formField.fullName=item.fullName
          //   this.formField.ecuName=item.ecuName
          // })

        }
     })
    },
    // 重置
      reset1(){
        this.formField.fileType=""
      },
    // 关闭窗口
    closeEdit() {
      this.$emit("updateVisible", false);
      this.oneTableKey = this.$utils.generateId();
    },
  },
};
</script>

<style lang="scss" scoped>
.filter-title {
  font-size: 18px;
  font-weight: bolder;
}
.filter-container.filter-title::before {
  border-left: 4px solid #0075ff;
  padding-right: 10px;
  height: 20px;
  left: 0px;
  top: 4px;
}
</style>

